import React, {PureComponent} from 'react';
import {Modal,Button,Input}from 'antd';
import styles from '../common/PateoTable/TableList.less';

export default class PreviewModal extends PureComponent<any, any> {
    render(){
        const { visible, contentData, type, changeVisible } = this.props;
        const style = {
            height: type === "horizontal" ? 400: 500,
            width: type === "horizontal" ? 600 : 400,
            overflowY: 'scroll',
            wordBreak:"break-all"
        };
        return(
            <Modal
                style={{ top: 40 }}
                width={type === "horizontal" ? 650 : 450 }
                title={type === "horizontal" ? '横屏预览' : (type === "vertical" ? '横屏预览' : '预览' )}
                visible={visible}
                onCancel={() => changeVisible()}
                footer={[<Button key="back" type="primary" size={"small"} onClick={() => changeVisible()}>关闭</Button>]}
            >
                <div style={{ ...style}}>
                    <p
                        className={styles.vertical}
                        dangerouslySetInnerHTML={{ __html: contentData }}
                    />
                </div>
            </Modal>
        );
    }
}
